<template>
    <div id="app">
        <el-card class="box-card">
            <el-descriptions title="用户信息" :column="3">
                <el-descriptions-item label="证件照">
                    <img :src="loginAdmin.avatar" height="100px" width="75px"/>
                </el-descriptions-item>
                <el-descriptions-item label="员工姓名">{{loginAdmin.loginName}}</el-descriptions-item>
                <el-descriptions-item label="员工账号">{{loginAdmin.userName}}</el-descriptions-item>
                <el-descriptions-item label="联系方式">{{loginAdmin.phonenumber}}</el-descriptions-item>
                <el-descriptions-item label="邮箱">{{loginAdmin.email}}</el-descriptions-item>
                <el-descriptions-item label="创建时间">{{loginAdmin.createTime}}</el-descriptions-item>
                <el-descriptions-item label="身份证号">{{loginAdmin.identity}}</el-descriptions-item>
                <el-descriptions-item label="年龄">{{loginAdmin.age}}</el-descriptions-item>
                <el-descriptions-item label="生日">{{loginAdmin.birthday}}</el-descriptions-item>
                <el-descriptions-item label="状态">
                    <el-tag type="warning" size="mini" effect="dark" v-if="loginAdmin.status==0">正常</el-tag>
                    <el-tag type="info" effect="dark" size="mini" v-if="loginAdmin.status==1">停用</el-tag>
                </el-descriptions-item>
                <el-descriptions-item label="功能">
                    <el-button type="success" size="mini" @click="addEmp" >修改个人信息</el-button>
                </el-descriptions-item>
            </el-descriptions>
            <div class="text item">
                <el-collapse accordion>
                    <el-collapse-item title="备注" name="1">
                        <div>{{loginAdmin.remark}}</div>
                    </el-collapse-item>
                    <el-collapse-item title="其他信息信息" name="2">
                        <div>最后登录时间：{{loginAdmin.loginDate}}</div><div>最后登录ip：{{loginAdmin.loginIp}}</div>
                    </el-collapse-item>
                </el-collapse>
            </div>
        </el-card>
    </div>
</template>

<script>
    import Vue from 'vue';
    import axios from 'axios';
    import VueAxios from 'vue-axios';
    Vue.use(VueAxios, axios);
    export default {
        name: "myList",
        data(){
            return{
                loginAdmin:{},
            }
        },
        created() {
            // 获取路由id值
            // 调用接口得到医院设置信息
            this.initUserInfo();
        },
        methods:{
            //初始化用户信息
            initUserInfo(){
                axios.get("system/api/admin/info").then(result=>{
                    if(result.data.code === 200){
                        this.loginAdmin = result.data.data;
                    }
                })
            },
            addEmp(){
                this.$router.push({ path: 'editMyList' })
            },

        },
    }
</script>

<style scoped>
    #app{
        border: 1px solid #DCDFE6;
        width: 800px;
        margin: 30px auto;
        padding: 35px 25px 15px 25px;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 0 0 25px #909399;
    }
    .text {
        font-size: 14px;
    }

    .item {
        padding: 18px 0;
    }

    .box-card {
        width: 800px;
    }
</style>
